<!doctype html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" /> -->

    <title>Document</title>

    <style>
      /* body { */
      /* margin: 0; */
      /* padding: 0; */
      /* border: 0; */
      /* } */

      p {
        border: 2px solid green;
      }

      .abspos {
        /* //fixed运行结果与absolute结果一致 */
        position: relative;
        background-color: green;
        color: #fff;
        top: 30px;
        /* top: 0px; */
        right: 4px;
        width: 400px;
      }

      .test2 {
        border: 2px solid green;
        width: 500px;
        height: 200px;
        margin-top: 8px;
      }

      .test3 {
        border: 2px solid green;
        width: 500px;
        height: 200px;
        margin-top: 8px;
      }
    </style>
  </head>
  <body>
    <div class="box">
      <p>
        One November night in the year 1782, so the story runs, two brothers sat over their winter
        fire in the little French town of Annonay, watching the grey smoke-wreaths from the hearth
        curl up the wide chimney.
      </p>
      <p class="abspos">
        Their names were Stephen and Joseph Montgolfier, they were papermakers by trade, and were
        noted as possessing thoughtful minds and a deep interest in all scientific knowledge and new
        discovery.
      </p>
      <p>
        Before that night—a memorable night, as it was to prove—hundreds of millions of people had
        watched the rising smoke-wreaths of their fires without drawing any special inspiration from
        the fact.”
      </p>
    </div>

    <div class="test2">
      <div class="test3"></div>
    </div>
  </body>
</html>
